// 初始化页面
search()

// 回车搜索
$("input[type=text]").keyup(function (e) {
    if (e.keyCode == 13) {
        search()
    }
})
// 获取歌曲列表数据
function search() {
    $.ajax({
        type: "get",
        url: "https://apis.netstart.cn/music/search",
        data: {
            keywords: $("input[type=text]").val(),
        },
        success: function (res) {
            console.log(res.result.songs)
            var songsData = res.result.songs
            // 渲染歌曲列表数据
            renderData(songsData)
            // 以下为初始化页面
            // 热评
            hot(songsData[0].id)
            // 音乐来源
            music(songsData[0].id)
            // cd图片
            musicPic(songsData[0].id)
        },
        beforeSend: function (res) {
            $(".container-left").html("正在加载......")
            $(".container-right").html("正在加载......")
        }
    })
}
// 封装一个歌曲列表数据的函数
function renderData(myData) {
    var songsStr = ""
    $(myData).each(function (index, item) {
        songsStr += `<p>
        <span>${item.name} (${item.artists[0].name})</span>
        `
        if (item.mvid != 0) {
            songsStr += `<span class="img"></span>
            </p>
        `
        }
    })

    $(".container-left").html(songsStr)
    $(".container-left P:first").addClass("active")
    // 给每个列表添加点击事件并渲染对应数据
    $(".container-left P").click(function () {
        var index = $(this).index()
        // 点击谁谁就高亮
        $(this).addClass("active").siblings().removeClass("active")
        // 获取点击对应的歌曲id
        var songDataId = myData[index].id
        // 获取mv的id
        var mvId = myData[index].mvid
        // 热评
        hot(songDataId)
        // 音乐来源
        music(songDataId)
        // cd图片
        musicPic(songDataId)
        // mv
        if (mvId != 0) {
            musicMv(mvId)
        }
    })
    // 显示播放器
    $(".container-left P>.img").click(function () {
        $(".video").css({
            display: "block",
        })
        $(".player").css({
            display: "none",
        })
    })
}
function musicMv(mvId) {
    $.ajax({
        type: "get",
        url: "https://apis.netstart.cn/music/mv/url",
        data: {
            id: mvId,
        },
        success: function (res) {
            var mvData = res.data
            // 调用渲染函数
            renderMvData(mvData)
        },
    })
}
function renderMvData(mvData) {
    var mvStr = ""
    mvStr += `
    <img src="./Sass-音乐播放器素材/images/shutoff.png">
    <video src="${mvData.url}" controls></video>`
    $(".video").html(mvStr)
    $(".video img").click(function () {
        $(".video").css({
            display: "none",
        })
        $(".player").css({
            display: "block",
        })
    })
}

// 获取20条热评数据
function hot(songId) {
    $.ajax({
        type: "get",
        url: "https://apis.netstart.cn/music/comment/hot",
        data: {
            type: 0,
            id: songId,
        },
        success: function (res) {
            var hotData = res.hotComments
            // 调用渲染函数
            renderHotData(hotData)
        },
        beforeSend: function (res) {
            $(".container-right").html("正在加载......")
        }
    })
}
// 封装一个渲染热评数据的函数
function renderHotData(hotData) {
    var hotStr = ""
    hotStr += `<h4>热门留言</h4>`
    $(hotData).each(function (index, item) {
        hotStr += ` <div class="message">
        <img src="${item.user.avatarUrl}" alt="">
            <div class="content">
                <h5>${item.user.nickname}</h5>
                <span>${item.content}</span>
            </div>
    </div>`
    })
    $(".container-right").html(hotStr)
}

// 获取歌曲的url
function music(songId) {
    $.ajax({
        type: "get",
        url: "https://apis.netstart.cn/music/song/url",
        data: {
            id: songId,
        },
        success: function (res) {

            var music = res.data
            // 调用渲染函数
            renderMusicData(music)
            if (res.status == 403) {
                alert("该歌曲没有版权")
                return
            }
        },
    })
}
// 封装一个渲染歌曲url的函数
function renderMusicData(musicData) {
    var musicStr = ""
    musicStr += `<audio src="${musicData[0].url}" controls ></audio>`
    $(".player-status").html(musicStr)
    // 根据歌曲的状态变化cd的样式
    $("audio")[0].ontimeupdate = function () {
        if (!$("audio")[0].paused) {
            $(".container-middle .cd").addClass("cd-animation").removeClass("paused")
            $(".container-middle>img").addClass("img-animation")
        } else {
            $(".container-middle .cd").addClass("paused")
            $(".container-middle>img").removeClass("img-animation")
        }
    }
}

// 获取歌曲详情
function musicPic(songId) {
    $.ajax({
        type: "get",
        url: "https://apis.netstart.cn/music/song/detail",
        data: {
            ids: songId,
        },
        success: function (res) {
            var pic = res.songs
            // 调用渲染函数
            renderPicData(pic)
        },
    })
}
// 封装一个渲染歌曲详情的函数
function renderPicData(picData) {
    var picStr = ""
    picStr += `<img src="${picData[0].al.picUrl}">
    <img src="./Sass-音乐播放器素材/images/disc.png">`
    $(".container-middle .cd").html(picStr)
}

